(function ($) {
	'use strict';
	
	var SwapGroupOut = Backbone.View.extend({
		tagName: "div",
		id:"SwapGroupOut",
		className: "SwapGroupOut",
		events: {
			'mousewheel':'domScroll',
			'DOMMouseScroll':'domScroll'
		},
		initialize: function (options) {
			// console.log("$$$$$ SwapGroupOut initialize");
			// this.swapGroupOut = options.swapGroupOut;
			this.navBar = options.navBar;
			this.title = options.title;
			
			this.swapGroupView = new $_V.SwapGroup();
			this.navBarView = new $_V.NavBar();
			this.TitleBar = new $_V.TitleBar();
			
			
			OKEvents.on('swapMoveTo', this.moveTo, this);
			
			
		},
		render: function(datas) {
			
			this.$el.html("");
			var dayDess = [];
			for (var i=0,len=datas.length; i<len; i++ ){
				var data = datas[i];
				var dayDes = data;
				dayDess.push(dayDes);
				var dayInfo = eval(data.timelinePhotos);
                console.log(dayInfo);
				this.swapGroupView.addOneDayModel(dayInfo,dayDes);
				this.navBarView.addOneNavBarModel(dayDes);
			}
			
			this.TitleBar.hasChange(dayDess[0]);
			var titleBarViewEl =this.TitleBar.el;
			this.title.append(titleBarViewEl);
			
			var navBarViewEl =this.navBarView.render().el;
			this.navBar.append(navBarViewEl);

			var swapGroupViewEl = this.swapGroupView.render().el;
			this.$el.append(swapGroupViewEl);
			
			return this;
		},
		domScroll:function(event){
		
			// console.log("##############domScroll");
			var even = event.originalEvent;
			var curDelta = even.wheelDelta ? -even.wheelDelta / 120 : (even.detail || even.deltaY) / 3;
			
			var offset = 250 * curDelta;
			this.moveTo(offset);
			var oEvent = $.event.fix( event );
			oEvent.preventDefault();
		},
		moveTo:function(offset){
			var fixLeft = 0;
				var scrollLeft = this.$el.scrollLeft();
				fixLeft = scrollLeft + offset;
			
			// this.$el.scrollLeft(fixLeft);
			
			
			var	animateOptions ={};
				animateOptions.duration = "normal";
				animateOptions.easing = "easeOutSine";
				animateOptions.complete =function(){
									OKEvents.trigger('animateMove',fixLeft);
								};
								
								
			
			this.$el.stop().animate({scrollLeft:fixLeft},animateOptions);
			
			// OKEvents.trigger('animateMove', fixLeft);
			
		}
		
	});
	$_V.SwapGroupOut = SwapGroupOut;
})(jQuery);	